{
	template:`
	<a-page-header title="查看缓存" :subTitle="host.ipport">
		<template #extra>
            <a-popconfirm title="确定要清除当前主机的缓存吗？（主机缓存除外）" @confirm="clearCache">
                <a-button type="primary" danger>清除缓存</a-button>
            </a-popconfirm>
			<m-back @click="back(false);">关闭</m-back>
		</template>
		<a-row>
		    <a-col span="2">
                <a-tabs v-model:activeKey="activeKey" tab-position="left" style="margin:10px 0 0 -20px;">
                    <a-tab-pane key="cacheHost" tab="主机缓存">
                    </a-tab-pane>
                    <a-tab-pane key="cacheMap" tab="单key缓存">
                    </a-tab-pane>
                    <a-tab-pane key="cacheMap2" tab="双key缓存">
                    </a-tab-pane>
                    <a-tab-pane key="cacheList" tab="列表缓存">
                    </a-tab-pane>
                </a-tabs>
		    </a-col>
		    <a-col span="22">
		        <div v-if="activeKey=='cacheHost'">
                    <a-card hoverable bodyStyle="padding:0">
                        <a-table :columns="cacheField" :data-source="cacheHost" size="small" :pagination="false">
                            <template #headerCell="{ column }">
                                <template v-if="column.key=='key'">
                                    <a-input-search v-model:value="searchHostKey" placeholder="搜索 Key" allowClear/>
                                </template>
                                <template v-else-if="column.key=='value'">
                                    <a-input-search v-model:value="searchHostValue" placeholder="搜索 Value" allowClear/>
                                </template>
                                <template v-else>
                                    {{column.title}}
                                </template>
                            </template>
                            <template #bodyCell="{ column, record }">
                                <block v-if="(!searchHostKey||record.key.indexOf(searchHostKey)>=0)&&(!searchHostValue||record.value.indexOf(searchHostValue)>=0)">
                                    <template v-if="column.key=='value'">
                                        <json-val :json-val="record.value" :current-depth="0" :max-depth="2" :last="true"></json-val>
                                    </template>
                                    <template v-else>
                                        {{record[column.key]}}
                                    </template>
                                </block>
                                <block v-else> </block>
                            </template>
                        </a-table>
                    </a-card>
		        </div>
		        <div v-if="activeKey=='cacheMap'">
                    <a-card hoverable bodyStyle="padding:0;">
                        <a-collapse :bordered="false" accordion>
                            <a-collapse-panel v-for="(item,key) in cacheMap" :key="key" :header="item.key">
                                <a-row :gutter="8">
                                    <a-col v-for="(obj,k) in item.value" :span="6">
                                        <a-typography-text code>{{k}}</a-typography-text>
                                        <json-val :json-val="obj" :current-depth="0" :max-depth="1" :last="true"></json-val>
                                    </a-col>
                                </a-row>
                            </a-collapse-panel>
                        </a-collapse>
                    </a-card>
		        </div>
		        <div v-if="activeKey=='cacheMap2'">
                    <a-card hoverable bodyStyle="padding:0;">
                        <a-collapse :bordered="false" accordion>
                            <a-collapse-panel v-for="(item,key) in cacheMap2" :key="key" :header="item.key">
                                <a-row :gutter="8">
                                    <a-col v-for="(obj,k) in item.value" :span="6">
                                        <a-typography-text code>{{k}}</a-typography-text>
                                        <json-val :json-val="obj" :current-depth="0" :max-depth="1" :last="true"></json-val>
                                    </a-col>
                                </a-row>
                            </a-collapse-panel>
                        </a-collapse>
                    </a-card>
		        </div>
		        <div v-if="activeKey=='cacheList'">
                    <a-card hoverable bodyStyle="padding:0;">
                        <a-collapse :bordered="false" accordion>
                            <a-collapse-panel v-for="(item,key) in cacheList" :key="key" :header="item.key">
                                <a-tabs size="small" type="card">
                                    <a-tab-pane v-for="(list,v) in item.value" :key="v" :tab="v">
                                        <a-typography-text code>{{v}}</a-typography-text>
                                        <a-row :gutter="8">
                                            <a-col v-for="obj in list" :span="6">
                                                <json-val :json-val="obj" :current-depth="0" :max-depth="1" :last="true"></json-val>
                                            </a-col>
                                        </a-row>
                                    </a-tab-pane>
                                </a-tabs>
                            </a-collapse-panel>
                        </a-collapse>
                    </a-card>
		        </div>
		    </a-col>
		</a-row>
	</a-page-header>
	`,
	props: ['localeZh','param','parentVue'],
	data:function(){
		return {
			host:{},
			urlHost:'',
			activeKey:'cacheHost',
			cacheHost:[],
			cacheField:[{title:'key',dataIndex:'key',key:'key'},
                {title:'value',dataIndex:'value',key:'value'},
                {title:'timeout',dataIndex:'timeout',key:'timeout'},
                {title:'addSecond',dataIndex:'addSecond',key:'addSecond'}
            ],
			searchHostKey:'',
			searchHostValue:'',
			cacheMap:[],
			cacheMap2:[],
			cacheList:[]
		};
	},
	mounted(){
		this.host=this.param.host;
		if(this.host.ipport!='.'){
			this.urlHost=this.host.ipport.replace('/','').split(":")[0]+":"+this.host.serverPort+"/";
		}
		this.loadCacheList();
	},
	methods:{
	    loadCacheList:function(){
            this.requestData("action/manage/hostInfo/getCacheList",
                {urlHost:this.urlHost},
                function(data){
                    if(data.code==0){
                        this.host=data.model;
                        this.cacheHost=data.cacheHost;
                        this.cacheMap=data.cacheMap;
                        this.cacheMap2=data.cacheMap2;
                        this.cacheList=data.cacheList;
                    }
                }.bind(this)
            );
	    },
        clearCache:function(){
            this.requestData("action/manage/hostInfo/clearCache",
                {urlHost:this.urlHost},
                function(data){
                    if(data.code==0){
						this.remind().success(data.msg);
                        this.loadCacheList();
                    }else{
						this.remind().error(data.msg);
					}
                }.bind(this)
            );
        }
	}
}